<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY>
<style>
#source td{padding:10px 5px;}
#target td{padding:10px 5px;}
</style>
<div id='test' style="border:1px solid black;width:400px;overflow:hidden;cursor:pointer;">
<table border="0" cellspacing="0" cellpadding="0">
<tr><td id="source">
<table border="0" cellspacing="0" cellpadding="0">
<tr><td><img width="90" height="90" src="images/p1.gif"></td>
<td><img width="90" height="90" src="images/p2.jpg"></td>
<td><img width="90" height="90" src="images/p3.gif"></td>
<td><img width="90" height="90" src="images/p4.jpg"></td>
<td><img width="90" height="90" src="images/p5.jpg"></td>
<td><img width="90" height="90" src="images/p6.jpg"></td>
<td><img width="90" height="90" src="images/p7.jpg"></td>
<td><img width="90" height="90" src="images/p8.jpg"></td>
</table></td>
<td id="target"></td></tr>
</table>
</div>
<input type="button" onclick="pre()" value='pre'>
<input type="button" onclick="next()" value='next'>
<script>
var $ = function(id){return document.getElementById(id)}
var img_count = $('source').getElementsByTagName('td').length
var img_width = $('source').getElementsByTagName('td')[0].offsetWidth
$('target').innerHTML = $('source').innerHTML
var s = setTimeout("scroll()",2000)
function scroll(){ next() }
function pre(){
	clearTimeout(s)
	if($('test').scrollLeft<=0) $('test').scrollLeft = img_count*img_width
	for(var i=10;i<=img_width;i+=10) setTimeout(function(){$('test').scrollLeft-=10},i*10)
	s = setTimeout("scroll()",2000)
}
function next(){
	clearTimeout(s)
	if($('test').scrollLeft>=img_count*img_width) $('test').scrollLeft = 0
	for(var i=10;i<=img_width;i+=10) setTimeout(function(){$('test').scrollLeft+=10},i*10)
	s = setTimeout("scroll()",2000)
}
$('test').onmouseover = function(){
	clearTimeout(s)
}
$('test').onmouseout = function(){
	s = setTimeout("scroll()",2000)
}
</script>
</BODY>
</HTML>
